﻿<%@ Page Culture="auto" UICulture="auto" Language="C#" MasterPageFile="~/Site.Master"
    AutoEventWireup="true" CodeBehind="Standard.aspx.cs" Inherits="BM.Tools.WebControls.MForm.Example.ValueHandlers.Standard"
    Title="Standard value handlers" %>

<%@ Register Assembly="BM.Tools.WebControls.MForm" Namespace="BM.Tools.WebControls.MForm.Controls.ValueHandlers"
    TagPrefix="mfvh" %>
<%@ Register Assembly="BM.Tools.WebControls.MForm" Namespace="BM.Tools.WebControls.MForm.Controls"
    TagPrefix="mf" %>
<%@ Register Assembly="BM.Tools.WebControls.MForm" Namespace="BM.Tools.WebControls.MForm.Controls.Titles"
    TagPrefix="mftitle" %>
<asp:Content ContentPlaceHolderID="Demonstration" runat="server">
    <p>
        In this demonstration you will see value handler for generic ASP.NET webcontrols:
    </p>
    <mf:RootValidator runat="server" ControlToValidate="Root1" />
    <mf:Root ID="Root1" runat="server">
        <Contents>
            <mf:Branch Name="StandardValueHandlers" runat="server">
                <Contents>
                    <div class="Section">
                        <mftitle:TitleControl runat="server" Text="The textbox value handler" />
                        <p>
                            The <code>TextBoxValueHandler</code> is the default leaf value handler. In other
                            words, when no value handler is set for the leaf, the <code>TextBoxValueHandler</code>
                            will be used and effectively a textbox will be displayed.
                        </p>
                        <p>
                            The use of TextBoxValueHandler is pretty straightforward. Any changes to the actual
                            TextBox can be made in the inner content property: TextBox.
                        </p>                    
                    </div>
                    <mf:Leaf Name="DefaultLeaf" runat="server" />
                    <mf:Leaf Name="CustomTextBoxLeaf" runat="server">
                        <ValueHandler>
                            <mfvh:TextBoxValueHandler runat="server">
                                <TextBox Rows="7" TextMode="MultiLine" />
                            </mfvh:TextBoxValueHandler>
                        </ValueHandler>
                    </mf:Leaf>
                    <div class="Section">
                        <mftitle:TitleControl runat="server" Text="The listbox and dropdownlist value handlers" />
                        <p>
                            The <code>ListBoxValueHandler</code> is the value handler for the <code>ListBox</code>
                            control, whereas the <code>DropDownListValueHandler</code> is the value handler
                            for the <code>DropDownList</code> control.
                        </p>
                        <p>
                            Both value handlers by default create an empty option at the beginning of <code>ListItem</code>'s
                            list. This can be turned off by setting the property <code>EmptyOptionFirst</code>
                            to <code>false</code>. Also the text of this option may be changed using the <code>EmptyOptionText</code>
                            option.
                        </p>
                        <p>
                            To support multiple listbox's multiple selection mode, the <code>ListBoxValueHandler</code>'s
                            <code>ValueSeparator</code> property must be set and different than null or empty
                            string. This output value will be a string created from joining the selected values
                            with the separator.
                        </p>
                    </div>
                    <mf:Leaf Name="ListBoxLeaf" runat="server">
                        <ValueHandler>
                            <mfvh:ListBoxValueHandler runat="server" ValueSeparator=" ">
                                <ListBox>
                                    <asp:ListItem Text="one option" Value="one" />
                                    <asp:ListItem Text="second option" Value="two" />
                                    <asp:ListItem Text="other option" Value="three" />
                                </ListBox>
                            </mfvh:ListBoxValueHandler>
                        </ValueHandler>
                    </mf:Leaf>
                    <mf:Leaf Name="DropDownListLeaf" runat="server">
                        <ValueHandler>
                            <mfvh:DropDownListValueHandler ID="ListBoxValueHandler1" runat="server">
                                <DropDownList>
                                    <asp:ListItem Text="one option" Value="one" />
                                    <asp:ListItem Text="second option" Value="two" />
                                    <asp:ListItem Text="other option" Value="three" />
                                </DropDownList>
                            </mfvh:DropDownListValueHandler>
                        </ValueHandler>
                    </mf:Leaf>
                    <div class="Section">
                        <mftitle:TitleControl runat="server" Text="The RadioButtonList value handler" />
                        <p>
                            The <code>RadioButtonListValueHandler</code> also contains the <code>EmptyOptionFirst</code>
                            and <code>EmptyOptionText</code> properties, they work exactly the same as in <code>
                                ListBoxValueHandler</code> and <code>DropDownListValueHandler</code>.
                        </p>
                        <div class="Remark">
                            <p>
                                Be careful using the <code>RepeatLayout</code>, <code>RepeatDirection</code> and
                                <code>RepeatColumns</code> properties of the <code>RadioButtonList</code>. They
                                might not compose well with the default MForm layout, so additional work with css
                                is needed.</p>
                        </div>
                    </div>
                    <mf:Leaf Name="RadioButtonListLeaf" runat="server">
                        <ValueHandler>
                            <mfvh:RadioButtonListValueHandler ID="RadioButtonListValueHandler1" runat="server">
                                <RadioButtonList>
                                    <asp:ListItem Text="one option" Value="one" />
                                    <asp:ListItem Text="second option" Value="two" />
                                    <asp:ListItem Text="other option" Value="three" />
                                </RadioButtonList>
                            </mfvh:RadioButtonListValueHandler>
                        </ValueHandler>
                    </mf:Leaf>
                    <div class="Section">
                        <mftitle:TitleControl runat="server" Text="The checkbox value handler" />
                        <p>
                            The <code>CheckBoxValueHandler</code> has two vital properties:</p>
                        <ul>
                            <li><code>OnValue</code> property: the returning value of the leaf item if the checkbox
                                is checked on send, the default value is 'on' </li>
                            <li><code>OffValue</code> property: the returning value of the leaf item if the checkbox
                                is not checked on send, the default value is an empty string </li>
                        </ul>
                    </div>
                    <mf:Leaf Name="CheckBoxLeaf" runat="server">
                        <ValueHandler>
                            <mfvh:CheckBoxValueHandler OnValue="true" OffValue="false" ID="CheckBoxValueHandler1"
                                runat="server">
                                <CheckBox ID="CheckBox1" runat="server" />
                            </mfvh:CheckBoxValueHandler>
                        </ValueHandler>
                    </mf:Leaf>
                    <div class="Section">
                        <mftitle:TitleControl runat="server" Text="The CheckBoxList value handler" />
                        <p>
                            The <code>CheckBoxListValueHandler</code> is similar to the ListBoxValueHandler,
                            as it allows many values at once to be provided. The difference is that the CheckBoxListValueHandler
                            accepts many values by default. Eventually all values from one <code>CheckBoxListValueHandler</code>
                            are taken from and written to only one leaf node, so the array of values is converted
                            to and from string with the use of split and join. This is done with the use of
                            <code>ValueSeparator</code> property.
                        </p>
                        <div class="Remark">
                            <p>
                                Because of common inheritance, the <code>CheckBoxListValueHandler</code> also contains
                                properties <code>EmptyOptionFirst</code> and <code>EmptyOptionText</code>, however
                                they are by default set to false.</p>
                        </div>
                        <div class="Remark">
                            <p>
                                Again, <code>RepeatLayout</code>, <code>RepeatDirection</code> and <code>RepeatColumns</code>
                                properties of the <code>RadioButtonList</code> might not compose well with the default
                                MForm layout, so additional work with css is needed.</p>
                        </div>
                    </div>
                    <mf:Leaf Name="CheckBoxListLeaf" runat="server">
                        <ValueHandler>
                            <mfvh:CheckBoxListValueHandler runat="server">
                                <CheckBoxList>
                                    <asp:ListItem Text="one option" Value="one" />
                                    <asp:ListItem Text="second option" Value="two" />
                                    <asp:ListItem Text="other option" Value="three" />
                                </CheckBoxList>
                            </mfvh:CheckBoxListValueHandler>
                        </ValueHandler>
                    </mf:Leaf>
                    <div class="Section">
                        <mftitle:TitleControl runat="server" Text="The FileUpload value handler" />
                        <p>
                            The <code>FileUploadValueHandler</code> is unique in its form, because it may only
                            serve providing data. The value of this handler cannot be set, because of security
                            issues (browsers do not allow it).
                        </p>
                        <p>
                            In order to show the previous value, a <code>CurrentValueLabel</code> property exists.
                            This property can be modified in .aspx as it is an inner property.
                        </p>
                    </div>
                    <mf:Leaf Name="FileUploadLeaf" runat="server">
                        <ValueHandler>
                            <mfvh:FileUploadValueHandler runat="server">
                                <FileUpload />
                                <CurrentValueLabel onclick="alert('Something can happen in here');" />
                            </mfvh:FileUploadValueHandler>
                        </ValueHandler>
                    </mf:Leaf>
                </Contents>
            </mf:Branch>
        </Contents>
    </mf:Root>
</asp:Content>
<asp:Content ID="Content1" ContentPlaceHolderID="Description" runat="server">
    <div class="Section">
        <mftitle:TitleControl runat="server" Text="The value handlers in general" />
        <p>
            To provide maximum extensibility to the MForm framework, the idea of value handlers
            has been introduced. Each <code>LeafItem</code> has a specific value handler. Each
            value handler is associated with a specific value control. The value control of
            the value handler should be a inner content property of the value handler, so the
            <code>TextBox</code> value control should be inside <code>TextBoxValueHandler</code>,
            a <code>ListBox</code> control should be inside <code>ListBoxValueHandler</code>,
            etc. All standard MForm value handlers which cover the standard form input controls
            are in the <span class="namespace">BM.Tools.WebControls.MForm.Controls.ValueHandlers</span>
            namespace.
        </p>
        <div class="Remark">
            <p>
                The value handler control itself has no representation in the rendered HTML, similarly
                to the <code>PlaceHolder</code> control.</p>
        </div>
        <p>
            A value handler is a control that is responsible for communication between the Leaf
            item and the value control. Particularly, the value handler control sets the value
            of the value control before the form is displayed and gets the value when the form is back (on the server side) and controls
            both the value getting/setting when the form is displayed (on the client side).
        </p>
        <p>
            The server side part of getting/setting the control value is done through the <code>Value</code> property. 
            This property needs to be implemented for every value handler.
        </p>
        <p>
            The client side part of getting and setting the control value is done through the
            <code>getControlValue</code> and <code>setControlValue</code> javascript methods.
        </p>
    </div>
</asp:Content>
